import React, { Component } from 'react';

import { Flex } from 'antd-mobile';

import 'antd-mobile/lib/flex/style/index.css';
import '../static/styles/footer.css';

class Footer extends Component {
    render() {
        return (
            <Flex className="footer-box" justify="around">
                <Flex direction="column">
                    <div className="footer-icon">
                        <i className="iconfont icon-shouye1 active"></i>
                    </div>
                    <div className="footer-title active">首页</div>
                </Flex>
                <Flex direction="column">
                    <div className="footer-icon">
                        <i className="iconfont icon-fenleii"></i>
                    </div>
                    <div className="footer-title">分类</div>
                </Flex>
                <Flex direction="column" className="green">
                    <div className="footer-icon">
                        <i className="iconfont icon-gouwuche1"></i>
                    </div>
                    <div className="footer-title">购物车</div>
                </Flex>
                <Flex direction="column" className="green">
                    <div className="footer-icon">
                        <i className="iconfont icon-gerenzhongxin"></i>
                    </div>
                    <div className="footer-title">我的</div>
                </Flex>
            </Flex>
        );
    }
}

export default Footer;
